require(["config"],function(){
    require(["jquery","template","header","cookie","bootstrap"],function($,template){
        function Confirm(){
            this.load();
            this.loadaddress();
            this.addListener();
        }
        $.extend(Confirm.prototype,{
            constructor: Confirm,
            load: function(){
                $.cookie.json = true;

                var products = $.cookie("settlement") || [];

                var data = {pro:products};

                var html = template("confirm-template",data);
                $(".tr-item").html(html);
                
                var num = 0;
                var amount = 0;
                products.forEach(function(prod){
                    num += (prod.amount*prod.lprice);
                    amount += prod.amount;
                });

                $(".allsum").text(num.toFixed(2));
                $(".allsum1").text((num+6).toFixed(2));
                $(".all-num").text(amount);
            },
            addListener:function(){
                $(".btn-add").on("click",$.proxy(this.addaddress,this));
                // console.log($(".addre"));
                // $(".addre").on("click",this.changeBgimg);
            },

            changeBgimg: function(){
                $(".addre").css({
                    "background-position":"0 0"
                });
                $(this).css({
                    "background-position":"0 -160px"
                });
            },
            addaddress: function(){

                var add = $(".province").val().slice(12) + $(".city").val().slice(12) + $(".district").val().slice(12) + $(".injiedao").val();

                // console.log($(".province").val());
                var html = `<div class="addre">
                                <h3>${$(".inname").val()}</h3>
                                <p class="mail">${add}</p>
                                <p class="phone">${$(".inphone").val()}</p>
                                <a href="javascript:void(0);" class="change">编辑</a>
                                <a href="javascript:void(0);" class="remove">删除</a>
                            </div>`;
                
                $(".oldAddress").append(html);
                $(".addre").on("click",this.changeBgimg);
                $(".remove").on("click",function(){
                    $(this).parents(".addre").remove();
                });
                
            },
            loadaddress: function(){
                this.loadProvince();
                $(".province").on("change",this.loadCity);
                $(".city").on("change",this.loadDistrict);
                

            },

            loadProvince: function(){
                var url1 = "http://route.showapi.com/1149-1?showapi_appid=29550&showapi_sign=fe01daee5a6a400c91e9f8523813fc61&level=1&page=1&maxSize=20",
                    url2 = "http://route.showapi.com/1149-1?showapi_appid=29550&showapi_sign=fe01daee5a6a400c91e9f8523813fc61&level=1&page=2&maxSize=20";
                $.when($.ajax(url1),$.ajax(url2))
                    .done(function(data1,data2){
                        var html = '<option value="-1">--请选择--</option>';
                        data1[0].showapi_res_body.data
                            .concat(data2[0].showapi_res_body.data)
                                .forEach(function(curr){
                                    html += `<option value="${curr.id + curr.areaName}">${curr.areaName}</option>`
                                });
                        $(".province").html(html);
    
                    })
            },
            loadCity: function(){
                var id = $(".province").val().slice(0,12);
                var url = `http://route.showapi.com/1149-2?showapi_appid=29550&showapi_sign=fe01daee5a6a400c91e9f8523813fc61&parentId=${id}`;
                $.ajax(url).done(function(data){
                    // console.log(data.showapi_res_body);
                    var html = '<option value="-1">--请选择--</option>';
                    data.showapi_res_body.data.forEach(function(curr){
                        html += `<option value="${curr.id + curr.areaName}">${curr.areaName}</option>`;
                    });
                    $(".city").html(html);
                });
            },
            loadDistrict: function() {
				// 获取选择的城市 id
				var id = $(".city").val().slice(0,12);
				// 根据 id 查询区县
				var url = `http://route.showapi.com/1149-2?showapi_appid=29550&showapi_sign=fe01daee5a6a400c91e9f8523813fc61&parentId=${id}`;
				$.ajax(url).done(function(data) {
					var html = '<option value="-1">--请选择--</option>';
					data.showapi_res_body.data.forEach(function(curr) {
						html += `<option value="${curr.id + curr.areaName}">${curr.areaName}</option>`;
					});
					$(".district").html(html);
				});
			}
        })

        new Confirm();
    });
});